<%--
  Created by IntelliJ IDEA.
  User: 猽
  Date: 2020/12/22
  Time: 16:21
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>员工登录</title>
    <link rel="stylesheet" href="resources/css/index.css">
    <link rel="stylesheet" href="resources/layui/css/layui.css">
</head>
<body>
<canvas class="cavs" width="1575" height="1337"></canvas>

<div class="loginmain">
    <div class="login-title">
        <span>员工登录</span>
    </div>
    <form class="layui-form layui-form-pane">
        <div class="login-con">
            <div class="login-user">
                <div class="icon">
                    <img src="resources/image/user_icon_copy.png" alt="">
                </div>
                <input type="text" name="username" placeholder="用户名" autocomplete="off" lay-verType="tips"
                       lay-verify="required" lay-reqText="用户名不能为空">
            </div>
            <div class="login-pwd">
                <div class="icon">
                    <img src="resources/image/lock_icon_copy.png" alt="">
                </div>
                <input type="password" name="password" placeholder="密码" autocomplete="off" lay-verType="tips"
                       lay-reqText="密码不能为空" name="password">
            </div>
            <div class="login-yan">
                <div class="icon">
                    <img src="resources/image/key.png" alt="">
                </div>
                <input type="text" lay-verify="required" lay-verType="tips" lay-reqText="验证码不能为空" name="checkCode"
                       placeholder="验证码" autocomplete="off" style="width: 120px">
                <img src="checkCode.do" id="checkCodeImg"
                     style="height: 0.5rem;width: 120px;position: relative;left: 130px"/>
            </div>
            <div class="login-btn">
                <input class="btn" type="button" value="登录" lay-submit lay-filter="subBtnFilter">
            </div>
        </div>
    </form>

</div>

</body>
</html>
<script src="resources/layui/layui.js"></script>
<script>
    layui.use(['form', 'jquery', 'layer'], function () {
        let form = layui.form;
        let $ = layui.jquery;
        let layer = layui.layer;

        form.on("submit(subBtnFilter)", function (d) {
            //获取表单数据
            let formData = d.field;
            $.post("user.do?service=login", formData, function (rs) {
                //登录失败 展示登录失败的原因
                if (rs.code != 200) {
                    //展示失败的原因
                    layer.msg(rs.msg);
                    return false;
                }
                //登录成功 进行页面的跳转
                location.href = "page.do?service=main"
            })
            return false;//阻止提交

        });
        //点击刷新验证码
        $("#checkCodeImg").click(function () {
            $(this).attr("src", "checkCode.do?" + new Date());
        });

        var whei = $(window).width()
        $("html").css({fontSize: whei / 24});
        $(window).resize(function () {
            var whei = $(window).width();
            $("html").css({fontSize: whei / 24})
        });
    })
</script>
